<script lang="ts" setup>
  import { ref } from 'vue';
  import { exportOrder } from '@/api/finance';
  import { Message } from '@arco-design/web-vue';

  const emit = defineEmits(['close']);

  const exporting = ref(false);
  const range = ref<string[] | undefined>([]);
  const handleSubmit = async () => {
    if (!range.value || range.value.length === 0) {
      Message.warning('请选择订单时间');
      return;
    }

    try {
      exporting.value = true;
      const res = await exportOrder({
        gmtCreateSpan: `${range.value[0]}TO${range.value[1]}`,
      });
      if (res.data.data) {
        window.open(res.data.data);
      }
    } finally {
      exporting.value = false;
    }
  };
</script>

<template>
  <a-modal
    title="选择订单时间"
    visible
    :width="400"
    :ok-loading="exporting"
    @cancel="emit('close')"
    @before-ok="handleSubmit"
  >
    <a-range-picker v-model="range" />
  </a-modal>
</template>
